<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>home 首页</title>

        <!-- 

        重置
        <link rel="stylesheet" href="../css/commCss/normalize.css">

        重置补充
        <link rel="stylesheet" href="../css/commCss/reset.css">
    
        公共属性样式
        <link rel="stylesheet" href="../css/commCss/property.css">
    
        公共模块样式
        <link rel="stylesheet" href="../css/commCss/basic.css">
    
        -->

</head>
<body>
    <div class="home">

        <div class="swiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="../imgs/qq20.jpg" alt=""></div>
                <div class="swiper-slide"><img src="../imgs/qq21.jpg" alt=""></div>
                <div class="swiper-slide"><img src="../imgs/qq25.jpg" alt=""></div>
            </div>
            <!-- 如果需要分页器 -->
            
            <div class="swiper-pagination"></div>
        </div>

        <div class="content container2">
            <div class="one">
                <div class="left">
                    <p class="writ">今日排名</p>
                    <img src="../imgs/index-card-rank.png" alt="">
                    <p class="num" id="rankNum">0</p>
                </div>

                <div class="right">
                    <p class="writ">累计打卡<span id="punchIn">23</span>天</p>
                    <img src="../imgs/index-card-sum.png" alt="">
                    <p class="num" id="clock">今日打卡</p>
                </div>
            </div>

            <div class="two">
                <div class="left" id="motionDate">
                    <p>运动数据</p>
                </div>

                <div class="right" id="motionBadge">
                    <p class="writ">累积运动徽章</p>
                    <img src="../imgs/index-card-badge.png" alt="">
                    <p class="num">
                        <span id="insigniaNum">0</span>枚
                    </p>
                </div>
            </div>
            <div class="three">
                <p>课程训练</p>
            </div>
            <div class="four">
                <p>户外跑步</p>
            </div>

        </div>

        <!-- 底部导航按钮 -->
        <!-- <div class="bottomNav">
            <div class="botNav">
                <a class="activ" href="./home.html">
                    <span class="iconfont icon-shouye"></span>
                    <span>首页</span>
                </a>
                <a href="./motionRun.html">
                    <span class="iconfont icon-xinshuai"></span>
                    <span>运动</span>
                </a>
                <a href="./circleFollow.html">
                    <span class="iconfont icon-quanzi"></span>
                    <span>圈子</span>
                </a>
                <a href="./myUser.html">
                    <span class="iconfont icon-wode1"></span>
                    <span>我的</span>
                </a>
            </div>
            
        </div> -->

    </div>
    
</body>
</html>